<template>
  <menuManageView
    :isLoading="isLoading"
    :defaultProps="defaultProps"
    :menudata="menudata"
    :tabsList="tabsList"
    :outActive="outActive"
    :dialogAddTopMenu="dialogAddTopMenu"
    :dialogAddChildMenu="dialogAddChildMenu"
    :appListSelect="appListSelect"
    :formMenuTop="formMenuTop"
    :formMenuChild="formMenuChild"
    :isAddChild="isAddChild"
    :formEditMenu="formEditMenu"
    @menuTabsClick="menuTabsClick"
    @addTopMenu="addTopMenu"
    @dialogAddTopMenuClose="dialogAddTopMenuClose"
    @addTopMenuCancel="addTopMenuCancel"
    @addTopMenuSure="addTopMenuSure"
    @addChildMenuCancel="addChildMenuCancel"
    @addChildMenuSure="addChildMenuSure"
    @dialogAddChildMenuClose="dialogAddChildMenuClose"
    @addChildMenu="addChildMenu"
    @menuNodeClick="menuNodeClick"
    @delMenu="delMenu"
    @editMenuKeep="editMenuKeep"
    ref="menuManage"
  ></menuManageView>
</template>

<script>
  import menuManageView from './menuManageView';

  export default {

    components: {
      menuManageView
      // name
    },
    name: "menuManageLogic",
    props: {
      // msg: String //  [name: typeof]
    },
    filters: {},
    computed: {},
    watch: {},
    data() {
      return {
        isLoading: false, // 加载状态
        menudata: [], // 菜单树
        defaultProps: { // 菜单
          children: 'childs',
          label: 'name'
        },
        tabsList: [], // 导航栏列表
        outActive: "", // 当前菜单栏的选项
        dialogAddTopMenu: false, // 新增顶级菜单弹窗状态
        dialogAddChildMenu: false,
        appListSelect: [], // 应用列表
        formMenuTop: {
          name: "",
          icon: "",
          url: "#",
          clientId: ""
        },
        formMenuChild: {
          name: "",
          path: "",
          icon: "",
          url: "",
          clientId: ""
        },
        formEditMenu: {
          name: "",
          path: "",
          icon: "",
          url: "",
          clientId: ""
        },
        isAddChild: true, // 是否可以新增子菜单
        selectNode: {} // 被选中的树节点信息
      }
    },
    created() {
      this.getDictMenuTabs();
    },
    mounted() {

    },
    methods: {
      getDictMenuTabs() {
        this.isLoading = true;
        let obj = {
          datatype: "activity"
        };
        _https.post.getDict(obj).then(res => {
          if (res.data.code == 0) {
            this.outActive = res.data.data[0].datavalue;
            this.tabsList = res.data.data;

            _https.post.getAppList().then(res => {
              if (res.data.code == 0) {
                this.appListSelect = res.data.data;
              } else {
                this.$message({type: 'error', message: res.data.message});
              }
            })

          } else {
            this.$message({type: 'error', message: res.data.message});
          }
        }).then(() => {
          this.getMenuList(this.outActive);
        })
      },
      // 获取菜单列表
      getMenuList(dataType) {
        this.isLoading = true;
        let obj = {
          type: dataType
        };
        _https.post.getMenuFind(obj).then(res => {
          if (res.data.code == 0) {
            this.menudata = res.data.data;
            this.isLoading = false;
          } else {
            this.$message({type: 'error', message: res.data.message});
          }
        })
      },
      /**
       * 点击菜单树节点
       * @param nodeInfo
       */
      menuNodeClick(nodeInfo) {
        this.isAddChild = false;
        this.formMenuChild = {
          path: `${nodeInfo.path}.`,
          clientId: nodeInfo.clientId
        };
        this.formEditMenu = {
          name: nodeInfo.name,
          path: nodeInfo.path,
          icon: nodeInfo.icon,
          url: nodeInfo.url,
          clientId: nodeInfo.clientId
        };
        this.selectNode = nodeInfo;
      },
      menuTabsClick(e) {
        this.outActive = e.name;
        this.getMenuList(e.name);
        this.isAddChild = true;
        this.editReset();
        this.$refs.menuManage.$refs.editForm.resetFields();
      },
      // 点击新增顶级菜单
      addTopMenu() {
        this.dialogAddTopMenu = true;
      },
      // 关闭弹窗的回调
      dialogAddTopMenuClose() {
        this.dialogAddTopMenu = false;
        this.reset();
        this.$refs.menuManage.$refs.addTopForm.resetFields();
      },
      // 取消新增顶级菜单
      addTopMenuCancel() {
        this.dialogAddTopMenu = false;
        // this.reset();
        // this.$refs.menuManage.$refs.addTopForm.resetFields();
      },
      // 确定新增顶级菜单
      addTopMenuSure() {
        let formMenuTop = this.formMenuTop;
        let newObj = {
          icon: formMenuTop.icon,
          name: formMenuTop.name,
          path: formMenuTop.name,
          type: this.outActive,
          url: formMenuTop.url,
          clientId: formMenuTop.clientId,
          pid: 0
        };

        this.$refs.menuManage.$refs.addTopForm.validate((valid) => {
          if (!valid) {
            return;
          } else {
            _https.post.getSaveActivityNew(newObj).then(res => {
              if (res.data.code == 0) {
                this.$message({type: 'success', message: res.data.message});
                this.dialogAddTopMenu = false;
                this.getMenuList(this.outActive);
                this.isAddChild = true;
                // this.reset();
                // this.$refs.menuManage.$refs.addTopForm.resetFields();
              } else {
                this.$message({type: 'error', message: res.data.message});
              }
            })
          }
        })
      },
      // 点击新增子菜单
      addChildMenu() {
        this.dialogAddChildMenu = true;
      },
      // 子菜单弹窗关闭的回调
      dialogAddChildMenuClose() {
        this.dialogAddChildMenu = false;
        this.childReset();
        this.isAddChild = true;
        this.$refs.menuManage.$refs.addChildForm.resetFields();
      },
      // 添加子菜单取消
      addChildMenuCancel() {
        this.dialogAddChildMenu = false;
        this.isAddChild = true;
        // this.childReset();
        // this.$refs.menuManage.$refs.addChildForm.resetFields();
      },
      // 添加子菜单确认
      addChildMenuSure() {
        let formMenuChild = this.formMenuChild;
        let newObj = {
          icon: formMenuChild.icon,
          name: formMenuChild.name,
          path: `${formMenuChild.path}${formMenuChild.name}`,
          type: this.outActive,
          url: formMenuChild.url,
          clientId: formMenuChild.clientId,
          pid: this.selectNode.id
        };

        this.$refs.menuManage.$refs.addChildForm.validate((valid) => {
          if (!valid) {
            return;
          } else {
            _https.post.getSaveActivityNew(newObj).then(res => {
              if (res.data.code == 0) {
                this.$message({type: 'success', message: res.data.message});
                this.dialogAddChildMenu = false;
                this.getMenuList(this.outActive);
                this.isAddChild = true;
                // this.childReset();
                // this.$refs.menuManage.$refs.addChildForm.resetFields();
              } else {
                this.$message({type: 'error', message: res.data.message});
              }
            })
          }
        })
      },
      // 删除菜单
      delMenu() {
        let obj = {
          id: this.selectNode.id
        };
        this.$confirm('此操作将永久删除该菜单, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          _https.post.getDeleteActivity(obj).then(res => {
            if (res.data.code == 0) {
              this.$message({type: 'success', message: res.data.message});
              this.getMenuList(this.outActive);
              this.editReset();
              this.$refs.menuManage.$refs.editForm.resetFields();
              this.isAddChild = true;
            } else {
              this.$message({type: 'error', message: res.data.message});
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });

      },
      // 编辑保存
      editMenuKeep() {
        let formEditMenu = this.formEditMenu;
        let obj = {
          id: this.selectNode.id,
          icon: formEditMenu.icon,
          name: formEditMenu.name,
          path: formEditMenu.path,
          show: 0,
          type: this.outActive,
          clientId: formEditMenu.clientId,
          url: formEditMenu.url
        };


        this.$refs.menuManage.$refs.editForm.validate((valid) => {
          if (!valid) {
            return;
          } else {
            _https.post.getUpdateActivity(obj).then(res => {
              if (res.data.code == 0) {
                this.$message({type: 'success', message: res.data.message});
                this.isAddChild = true;
                this.getMenuList(this.outActive);
              } else {
                this.$message({type: 'error', message: res.data.message});
              }
            })
          }
        })


      },
      reset() {
        this.formMenuTop = {icon: ""};
      },
      childReset() {
        this.formMenuChild = {
          path: "",
          icon: "",
          clientId: ""
        }
      },
      editReset() {
        this.formEditMenu = {
          path: "",
          icon: "",
        }
      }
    },
    destroyed() {

    }
  }
</script>

<style scoped lang="less">

</style>
